<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>商品详情</title>
  <link rel="icon" href="./favicon.ico">
  <link rel="stylesheet" href="../static/iconfont/iconfont.css">
  <link rel="stylesheet" href="./css/goodsDetail.css">
</head>
<body>
  @@include('./components/nav.html')
  @@include('./components/header.html')
  @@include('./components/stickyHeader.html')
  <div class="top-bg">
  </div>
  <div class="detail-nav">
    <div class="w2">
      <ul class="clearfix">
        <li>首页</li>
        <li>全部商品</li>
        <li>卫衣</li>
        <li>单品</li>
        <li>毛衫</li>
        <li>休闲裤</li>
        <li>内衣</li>
        <li>睡衣</li>
      </ul>
    </div>
  </div>
  <div class="goods-detail w2 clearfix">
    <div class="left-detail fl">
      <div class="img-detail fl">
        <div class="img">
          <img src="" alt="">
          <div class="mask"></div>
          <div class="bigImg">
            <img src="" alt="">
          </div>
        </div>
        <div class="img-list-wrap">
          <div class="img-list">
            <ul class='clearfix'>
            </ul>
          </div>
          <i class='iconfont icon-zuojiantou prev'></i>
          <i class='iconfont icon-youjiantou next'></i>
        </div>
      </div>
      <div class="goods-info fl">
        <div class="title">
        </div>
        <div class="main-box clearfix">
          <div class="price fl">
            <span class='price-title fl'>价格：</span><span class='price-text fl'></span>
          </div>
          <div class="sales fr">
            <span class="sales-title">累计销量：</span><span class='sales-count'></span>
          </div>
          <div class="comment fr">
            <span class="comment-title">评价：</span><span class="comment-count"></span>
          </div>
        </div>
        <div class="service clearfix">
          <span class='service-title fl'>客服：</span>
          <img src="https://s10.mogucdn.com/pic/140815/sp1ku_ieygin3dgeydoztbmiytambqmeyde_16x17.gif" alt="">
        </div>
        <ul class='params-container'>
        </ul>
        <div class="counter clearfix">
          <span class="counter-title fl">
            数量：
          </span>
          <div class="counters fl">
            <div class="dec fl">-</div>
            <input class='fl' type="text" value="1">
            <div class="inc fl">+</div>
          </div>
          <span class="store">
            库存<span class="store-text"></span>件
          </span>
        </div>
        <div class="operation">
          <button class='buy-now'>立即购买</button>
          <button class='turn-into-cart' id='turn-into-cart'>
            加入购物车
          </button>
        </div>
        <div class="service-intro">
          <span class="intro-title fl">服务说明：</span>
          <ul class='fl'>
            <li>
              <i></i>
              <div class="intro-text">
                15天无理由退货
              </div>
            </li>
            <li>
              <i></i>
              <div class="intro-text">
                延误必赔
              </div>
            </li>
            <li>
              <i></i>
              <div class="intro-text">
                退货补运费
              </div>
            </li>
          </ul>
        </div>
      </div>
    </div>
    <div class="right-recommend fr">
      <div class="recommend-title">热卖推荐</div>
      <ul class="recommend-list">
        <li>
          <img src="https://s5.mogucdn.com/mlcdn/c45406/190221_350jck54i03he7j32654d0fccjl80_720x960.jpg_220x330.jpg" alt="">
          <p class='price'>
            ￥<span class='price-text'>99.00</span>
          </p>
        </li>
        <li>
          <img src="https://s5.mogucdn.com/mlcdn/c45406/200412_247j3j9357iaf6gd00h3chicd7969_640x959.jpg_220x330.jpg" alt="">
          <p class='price'>
            ￥<span class='price-text'>59.90</span>
          </p>
        </li>
        <li>
          <img src="https://s5.mogucdn.com/mlcdn/c45406/190705_1a03l1fdlkliihea8j32fbl7316dh_640x960.jpg_220x330.jpg" alt="">
          <p class='price'>
            ￥<span class='price-text'>39.90</span>
          </p>
        </li>
        </li>
      </ul>
    </div>
  </div>
  <div class="goods-sdetail w2 clearfix">
    <div class="floors-wrapper fr">
      <div class="title">
        手机扫码下单
        <i class='qrcode iconfont icon-ico'></i>
        <i class='arrow iconfont icon-xiajiantou'></i>
        <div class="qrcodeimg">
          <img src="../static/images/detailimg/qrcode.png" alt="">
        </div>
      </div>
      <div class="floors">
        <ul>
          <li>产品描述</li>
          <li>产品参数</li>
          <li>图文详情</li>
        </ul>
      </div>
    </div>
    <div class="product-params fr">
      <ul class="title">
        <li class='active'>商品详情</li>
        <li>累计评价</li>
      </ul>
      <ul class="content">
        <li class='product-detail tabcard current'>
          <div class="goods-desc floor">
            <div class="title">
              <span class='tit'>商品描述</span>
            </div>
            <div class="content"></div>
          </div>
          <div class="goods-params floor">
            <div class="title">
              <span class='tit'>产品参数</span>
            </div>
            <ul class="content clearfix">
            </ul>
          </div>
          <div class="size-rules">
            <div class="title">
              <span class='tit'>尺码标准</span>
            </div>
            <table class='content'>
            </table>
            <div class="tip">
            </div>
          </div>
          <div class="effects floor">
            <div class="title">
              <span class='tit'>穿着效果</span>
            </div>
            <ul class='content clearfix'>
            </ul>
          </div>
        </li>
        <li class='comment tabcard'>
          <div class="title">
            <span class='tlt'>买家评价</span>
          </div>
          <ul class="content">
          </ul>
        </li>
      </ul>
    </div>
  </div>

  <div class="go-to-cart">
    <div class="title">
      <i></i>已将商品添加到购物车
    </div>
    <div class="but">
      <button class='stayhere'>留在本页</button><button class='gotocart'>去购物车结算<i class='iconfont icon-youjiantou'></i></button>
    </div>
    <div class="buy-list">
      <div class="title">购买过该商品的菇凉还购买了：</div>
      <ul class='clearfix'>
        <li>
          <img src="http://s5.mogucdn.com/mlcdn/c45406/200109_6f21fdfb106jjikg1jk9lb261eh8b_3332x4999.jpg" alt="">
          <p class="title">
            裤子男休闲裤男士港风韩版宽松束脚卫裤百搭学生运动裤
          </p>
          <p class="price">
            ￥85.00
          </p>
        </li>
        <li>
          <img src="http://s5.mogucdn.com/mlcdn/c45406/200131_88k62g061a47ch329c3cig903cccj_4217x6333.jpg" alt="">
          <p class="title">
            春季新款宽松套装女学生长袖休闲潮两件套卫衣春秋套装女
          </p>
          <p class="price">
            ￥81.00
          </p>
        </li>
        <li>
          <img src="http://s11.mogucdn.com/mlcdn/c45406/200901_5b90dj4j902cc4l460g6ljk2cafbe_750x1000.jpg" alt="">
          <p class="title">
            买一送一 半亩花田去角质慕斯面部清洁控油收缩毛孔去死皮男女
          </p>
          <p class="price">
            ￥69.90
          </p>
        </li>
        <li>
          <img src="http://s5.mogucdn.com/mlcdn/c45406/191218_8bj1ib7098jgfe90ljd6048l55h28_640x960.jpg" alt="">
          <p class="title">
            老爹鞋网红女ins超火百搭透气厚底休闲运动鞋子新款潮鞋
          </p>
          <p class="price">
            ￥59.00
          </p>
        </li>
      </ul>
    </div>
    <div class="close">x</div>
  </div>
  @@include('./components/footer.html')
  @@include('./components/asideShortCut.html')
  <script src="../static/javascripts/jquery.min.js"></script>
  <script src="./js/utils/utils.js"></script>
  <script src="../static/javascripts/axios.min.js"></script>
  <script src="./js/asideShortcut/asideShortcut.js"></script>
  <script src="./js/header/header.js"></script>
  <script type="module" src="./js/header/search.js"></script>
  <script type="module" src="./js/goodsDetail.js"></script>
</body>
</html>